import {Input} from "antd";

const { TextArea } = Input;
function InsertSystemCategory({onOk}:{onOk:()=>void}) {
  const titleOptions: { label: string; value: string }[] = [
    {
      label: "板 块",
      value: "plate",
    },
    {
      label: "反馈人",
      value: "feedbackPeople",
    },
    {
      label: "反馈日期",
      value: "feedbackDate",
    },
  ];

  const questionOptions:{ label: string; value: string }[] = [
    {
      label:"What general improvements do you consider could be made to the SMS?",
      value:'question1',
    },
    {
      label:"If you meet any difficult to comply with the SMS or are there any sentence is not clear ?",
      value:'question2',
    },
    {
      label:"If The SMS manuals contain clerical errors or omissions.?.",
      value:'question3',
    },
    {
      label:"If any mistake or omissions on SMS Checklist or report form?",
      value:'question4',
    }
  ]

  return (
    <div className={"insert_system_category"}>
      <div className={"grid_title"}>
        {titleOptions.map((i: { label: string; value: string }) => {
          return (
            <div key={i.value} className={"grid_title_item"}>
              <div className={"grid_title_item_label"}>{i.label}</div>
              <div className={"grid_title_item_value"}>{i.value}</div>
            </div>
          )
        })}
      </div>
      <div className={"question_list"}>
        {
          questionOptions.map((i:{ label: string; value: string },index:number)=>{
            return (
              <div key={i.value} className={"question_list_item"}>
                <p>{index+1 + '. ' + i.label}</p>
                <Input ></Input>
              </div>
            )
          })
        }
      </div>
      <div className={"feedback_content"}>
        <h4>回 复</h4>
        <TextArea></TextArea>
      </div>
      <div className={"footer_button"}>
        <i className={"iconfont icon-baocun"} onClick={onOk}></i>
      </div>
    </div>
  );
}

export default InsertSystemCategory;
